<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@include file="../base/taglibs.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<ssm:overwrite name="context">
											<div class="table-responsive">
											<div id="tableBtn">
												<a href="<c:url value="/UserRule/edit?userruleid=0"/>">
													<button class="btn btn-success">
														<i class="icon-edit icon-only bigger-150"></i>
													</button>
												</a>
												<a class="ajax-post"
													url="<c:url value="/UserRule/changeStatus?method=del"/>"
													target-form="ids">
													<button class="btn btn-sm btn-danger">
														<i class="icon-trash bigger-150"></i>
														删除
													</button>
												</a>
												<a class="ajax-post"
													url="<c:url value="/UserRule/changeStatus?method=open"/>"
													target-form="ids">
													<button class="btn btn-sm btn-info">
														<i class="icon-unlock bigger-150"></i>
														开启
													</button>
												</a>
												<a class="ajax-post"
													url="<c:url value="/UserRule/changeStatus?method=close"/>"
													target-form="ids">
													<button class="btn btn-sm btn-pink">
														<i class="icon-lock bigger-150"></i>
														关闭
													</button>
												</a>
											</div>
											<table id="sample-table" class="table table-striped table-bordered table-hover">
												<thead>
													<tr>
														<th class="center">
															<label>
																<input type="checkbox" class="ace" />
																<span class="lbl"></span>
															</label>
														</th>
														<td>id</td>
														<td>modules</td>
														<td>type</td>
														<td>link</td>
														<td>title</td>
														<td>status</td>
														<td>createtime</td>
														<td>pid</td>
														<td>rank</td>
														<td>description</td>
														<td>操作</td>
													</tr>
												</thead>

												<tbody>
												<c:forEach items="${LIST}" var="userrule">
													<tr>
														<td class="center">
															<label>
																<input type="checkbox" class="ace ids" name="id" value="${userrule.id}" />
																<span class="lbl"></span>
															</label>
														</td>
														<td>${userrule.id}</td>
														<td>${userrule.modules}</td>
														<td>${userrule.type}</td>
														<td>${userrule.link}</td>
														<td>${userrule.title}</td>
														<td>${userrule.status}</td>
														<td><ssm:FormatDate value="${userrule.createtime}" pattern="yyyy/MM/dd HH:mm:ss"/></td>
														<td>${userrule.pid}</td>
														<td>${userrule.rank}</td>
														<td>${userrule.description}</td>
														<td>
															<div class="visible-md visible-lg hidden-sm hidden-xs action-buttons">
																

																<a class="green" href="<c:url value="/UserRule/edit?userruleid=${userrule.id}"/>">
																	<i class="icon-pencil bigger-130"></i>
																</a>

																<a class="red" href="<c:url value="/UserRule/del?userruleid=${userrule.id}&method=del "/>">
																	<i class="icon-trash bigger-130"></i>
																</a>
															</div>

															<div class="visible-xs visible-sm hidden-md hidden-lg">
																<div class="inline position-relative">
																	<button class="btn btn-minier btn-yellow dropdown-toggle" data-toggle="dropdown">
																		<i class="icon-caret-down icon-only bigger-120"></i>
																	</button>

																	<ul class="dropdown-menu dropdown-only-icon dropdown-yellow pull-right dropdown-caret dropdown-close">
																		<li>
																			<a href="#" class="tooltip-info" data-rel="tooltip" title="View">
																				<span class="blue">
																					<i class="icon-zoom-in bigger-120"></i>
																				</span>
																			</a>
																		</li>

																		<li>
																			<a href="<c:url value="/UserRule/edit?userruleid=${userrule.id}"/>" class="tooltip-success" data-rel="tooltip" title="Edit">
																				<span class="green">
																					<i class="icon-edit bigger-120"></i>
																				</span>
																			</a>
																		</li>

																		<li>
																			<a href="<c:url value="/UserRule/del?userruleid=${userrule.id}&method=del "/>" class="tooltip-error" data-rel="tooltip" title="Delete">
																				<span class="red">
																					<i class="icon-trash bigger-120"></i>
																				</span>
																			</a>
																		</li>
																	</ul>
																</div>
															</div>
														</td>
													</tr>
													</c:forEach>
												</tbody>
											</table>
										</div>

</ssm:overwrite>
<ssm:overwrite name="script">
		<!-- page specific plugin scripts -->

		<script src="${STATIC}/js/jquery.dataTables.min.js"></script>
		<script src="${STATIC}/js/jquery.dataTables.bootstrap.js"></script>


		<!-- inline scripts related to this page -->

		<script type="text/javascript">
			jQuery(function($) {
				var oTable1 = $('#sample-table').dataTable( {
				"aoColumns": [
			      { "bSortable": false },
			      null, null,null, null, null,null, null,null, null, null,
				  { "bSortable": false }    
				],
				bPaginate : false
				} );
				
				
				$('table th input:checkbox').on('click' , function(){
					var that = this;
					$(this).closest('table').find('tr > td:first-child input:checkbox')
					.each(function(){
						this.checked = that.checked;
						$(this).closest('tr').toggleClass('selected');
					});
						
				});
			
			
				$('[data-rel="tooltip"]').tooltip({placement: tooltip_placement});
				function tooltip_placement(context, source) {
					var $source = $(source);
					var $parent = $source.closest('table')
					var off1 = $parent.offset();
					var w1 = $parent.width();
			
					var off2 = $source.offset();
					var w2 = $source.width();
			
					if( parseInt(off2.left) < parseInt(off1.left) + parseInt(w1 / 2) ) return 'right';
					return 'left';
				}
				
				function addBtnAndPageHtml(domName) {
					$str = '${PAGE_HTML}';
					$root = $(domName).parent();
					$btn = $root.children('div[class="row"]:first-child').children(
							'div:first-child');
					$page = $root.children('div[class="row"]:last-child').children(
							'div:last-child');
					$btn.append($('#tableBtn'));
					$page.append($str);
				}
				addBtnAndPageHtml('#sample-table');

			})
		</script>
</ssm:overwrite>
<jsp:include page="../base/base.jsp"></jsp:include>